<div style="width: 100%; height: 100%; overflow:hidden;" class="scroll-container"><div>
<div class="userinfo">
    <div class="icon"><img src="images/avatar.png" width="76px"/></div>
    <div class="userdetail">
        <span class="name">--</span> <br/>
        <span class="line2">
            账户余额：<span class="balance-count"> 0.00 </span>RMB
            <a href="#"><img src="images/icon-refresh.png" width="20px"></a>
        </span>
    </div>
    <div class="clear"></div>
</div>

<div class="tabs">
    <ul class="am-avg-sm-4">
        <li class="charge">存款</li>
        <li class="take">取款</li>
        <li class="charge_log">存款记录</li>
        <li class="take_log">取款记录</li>
    </ul>
</div>

<!-- 存款 -->
<div class="charge-c">
    <div class="disable">充值暂时关闭！</div>
    <div class="bank-charge item-charge hide">
        <a href="#">
            <table><tr>
                <td class="icon"><img src="images/transfer.png"/></td>
                <td>
                    <div class="title">银行转账</div>
                    <div class="clue">线下入款，大额首选</div>
                </td>
                <td class="arrow">
                    <img src="images/right.png"/>
                </td>
            </tr></table>
        </a>
    </div>

    <div class="alipay-charge item-charge hide">
        <a href="#">
            <table><tr>
                <td class="icon"><img src="images/zfb-icon.png"/></td>
                <td>
                    <div class="title">支付宝转账</div>
                    <div class="clue">支付宝人工转账</div>
                </td>
                <td class="arrow">
                    <img src="images/right.png"/>
                </td>
            </tr></table>
        </a>
    </div>
    
    <div class="alipay-online-charge item-charge hide">
        <a href="#">
            <table><tr>
                <td class="icon"><img src="images/zfb-icon.png"/></td>
                <td>
                    <div class="title">支付宝支付</div>
                    <div class="clue">支付宝在线支付</div>
                </td>
                <td class="arrow">
                    <img src="images/right.png"/>
                </td>
            </tr></table>
        </a>
    </div>

    <div class="wechat-charge item-charge hide">
        <a href="#">
            <table><tr>
                <td class="icon"><img src="images/wechat-icon.png"/></td>
                <td>
                    <div class="title">微信转账</div>
                    <div class="clue">微信扫一扫转账</div>
                </td>
                <td class="arrow">
                    <img src="images/right.png"/>
                </td>
            </tr></table>
        </a>
    </div>
    
    <div class="wechat-online-charge item-charge hide">
        <a href="#">
            <table><tr>
                <td class="icon"><img src="images/wechat-icon.png"/></td>
                <td>
                    <div class="title">微信支付</div>
                    <div class="clue">微信在线支付</div>
                </td>
                <td class="arrow">
                    <img src="images/right.png"/>
                </td>
            </tr></table>
        </a>
    </div>

    <div class="qq-charge item-charge hide">
        <a href="#">
            <table><tr>
                <td class="icon"><img src="images/ico-qq.svg"/></td>
                <td>
                    <div class="title">QQ钱包转账</div>
                    <div class="clue">支持QQ钱包人工转账</div>
                </td>
                <td class="arrow">
                    <img src="images/right.png"/>
                </td>
            </tr></table>
        </a>
    </div>
    
    <div class="qq-online-charge item-charge hide">
        <a href="#">
            <table><tr>
                <td class="icon"><img src="images/ico-qq.svg"/></td>
                <td>
                    <div class="title">QQ钱包支付</div>
                    <div class="clue">支持QQ钱包在线支付</div>
                </td>
                <td class="arrow">
                    <img src="images/right.png"/>
                </td>
            </tr></table>
        </a>
    </div>
    
    <div class="bank-online-charge item-charge hide">
        <a href="#">
            <table><tr>
                <td class="icon"><img src="images/ico-bank.svg"/></td>
                <td>
                    <div class="title">在线网银</div>
                    <div class="clue">支持国内各大银行在线网银</div>
                </td>
                <td class="arrow">
                    <img src="images/right.png"/>
                </td>
            </tr></table>
        </a>
    </div>
</div>

<!-- 取款 -->
<div class="take-c">
    <div class="common_item">
        <table style="width: 100%">
            <tr>
                <td class="input">
                    <input type="number" class="am-form-field amount" placeholder="请填写取款金额" />
                </td>
            </tr>
        </table>
    </div>
    <div class="form_clue">单笔下限<span class="red">100</span>，单笔上限<span class="red">1000000</span></div>
    <div class="common_item"><div class="bank-info">
    </div></div>

    <div class="common_item">
        <table style="width: 100%">
            <tr>
                <td class="input">
                    <input type="password" class="am-form-field password" placeholder="请填写取款密码" />
                </td>
            </tr>
        </table>
    </div>

    <div style="margin: 15px;">
        <button type="button" class="am-btn am-btn-primary btn-take common_button">确认提交</button>
    </div>
</div>

<!-- 存款/取款记录 -->
<div class="log-c">
    <table class="mobile">
        <thead>
        <tr value="-1">
            <th>时间</th>
            <th width="30%">金额</th>
            <th width="30%">状态</th>
        </tr>
        </thead>
        <tbody></tbody>
    </table>
    <div class="zxf_pagediv"></div>
</div>

</div></div>
<style type="text/css">
    body {
        background-color: #eeeeee;
    }
    .userinfo {
        height: 100px;
        border-bottom: 1px solid #fff;
        color: #64717a;
        font-size: 16px;
        background-color: rgba(255,255,255,0.4);
    }
    .userinfo .icon {
        float: left;
        width: 33%;
        text-align: center;
        padding-top: 14px;
    }
    .userinfo .userdetail {
        float: left;
        margin-top: 20px;
    }
    .userinfo .userdetail .line2 {
        font-size: 14px;
        color: #838383;
    }
    .userinfo .userdetail .name {
        font-weight: 600;
        color: #47535b;
    }
    .balance-count {
        color: #f15e22;
        font-weight: bold;
    }
    .mobile td {
        background-color: #fff;
    }
    .common_button { margin: 0px; }
    .charge-c .disable {
        text-align: center;
        color: red;
        line-height: 50px;
        display: none;
    }
</style>

<script src="js/charge_type.js"></script>
<script>
    $("#center-top .home").hide();
    $("#center-top .back").show();
    $("#center-top .menu").hide();
    $("#center-top .back2game").show();
    
    $(".charge-c").hide();
    $(".take-c").hide();
    $(".log-c").hide();
    var n = urlInfo.params.n;
    if (n == 'take') {
        $(".take-c").show();
        $(".tabs .take").attr("class", "take active");
    }
    else if (n == 'charge_log') {
        $(".log-c").show();
        $(".tabs .charge_log").attr("class", "charge_log active");
    }
    else if (n == 'take_log') {
        $(".log-c").show();
        $(".tabs .take_log").attr("class", "take_log active");
    }
    else {
        $(".tabs .charge").attr("class", "charge active");
        $(".charge-c").show();
        ChargeType.init();
    }

    // 填充我的信息
    ME.query(function() {
        fillUserInfo();
        if (n == "charge_log") {
            // 存款记录
            Util.queryTemplate($(".log-c tbody"), ".zxf_pagediv", null, function(page, size, cb) {
                startLoading();
                CMD.query_account_log2({
                    owner: "",
                    type: "deposit",
                    pageSize: size,
                    pageNum: page,
                }, function(r) {
                    stopLoading();
                    cb(r);
                });
            }, function(table, list, sum) {
                fillLog(list);
            });
        }
        else if (n == "take_log") {
            // 取款记录
            CMD.query_account_log2({
                owner: "",
                type: "withdraw",
                pageSize: 200,
            }, function(r) {
                fillLog(r.list);
            });
        }
    });
    function fillUserInfo() {
        if (context.user) {
            $(".userinfo .name").html(context.user.user.mobile || '游客');
            $(".userinfo .line2 .balance-count").html(" " + (context.user.balance / 100).toFixed(2) + " ");
            if (context.user.user.bank && context.user.user.bank != '') {
                var v = JSON.parse(context.user.user.bank);
                $(".take-c .bank-info").html(v.bank + " 尾号" + v.account.substring(v.account.length - 5) + " " +
                    (context.user.user.name || ''));
            }
            else if (n == 'take') {
                $("#clue2 #clue2_content").html("请先绑定银行卡信息！");
                $("#clue2").modal({
                    width: 250
                });
                window.clue2CB = function() {
                    Util.jumpUrl({
                        cmd: 'add_card'
                    });
                }
            }
        }
    }
    fillUserInfo();
    $(".line2 a").click(function() {
        startSpin();
        ME.query(function() {
            stopSpin();
            fillUserInfo();
        });
    })

    // tab标签切换
    $(".tabs .charge").click(function() {
        Util.jumpUrl({
            n: "charge",
        });
    });
    $(".tabs .take").click(function() {
        Util.jumpUrl({
            n: "take",
        });
    });
    $(".tabs .charge_log").click(function() {
        Util.jumpUrl({
            n: "charge_log",
        });
    });
    $(".tabs .take_log").click(function() {
        Util.jumpUrl({
            n: "take_log",
        });
    });

    // 取款处理
    $(".take-c .btn-take").click(function() {
        if (!context.user.user.bank || context.user.user.bank == '') return;
        var v = JSON.parse(context.user.user.bank);
        var amount = $(".take-c .amount").val();
        if (amount == '') {
            alert2("请输入取款金额！");
            return;
        }
        amount = parseInt(amount);
        if (amount < 100 || amount > 1000000) {
            alert2("取款金额不合法！");
            return;
        }
        if (context.user.user.dw > 0) {
            alert2("您的投注额度尚未达到要求，暂时无法取款！");
            return;
        }
        if (context.user.balance < amount * 100) {
            alert2("余额不足！");
            return;
        }
        var password = $(".take-c .password").val().trim();
        if (password == '') {
            alert2("请输入取款密码，如果未设置取款密码请先设置！");
            return;
        }

        if (password != context.user.user.tpassword && context.user.user.tpassword) {
            alert2("取款密码验证失败！");
            return;
        }
        var memo = {
            bank: v.bank,
            addr: v.addr,
            account: v.account,
        }
        startLoading();
        CMD.withdraw(context.user.user.id, "", amount*100, memo, function() {
            stopLoading();
            alert2("提交成功，请等待客服审核");
            ME.query();

            setTimeout(function() {
                Util.jumpUrl({
                    cmd: 'index'
                });
            }, 1500);
        }, function(message) {
            stopLoading();
            alert2("提交失败，错误原因：" + message);
            ME.query();
        });
    });

    var logList = [];
    function fillLog(list) {
        logList = list;
        var table = $(".log-c tbody");
        for (var i in list) {
            var d = list[i];
            var tr = $("<tr value='__i__'></tr>".replace(/__i__/, i));
            tr.append('<td>' + d.start.substring(5) + '</td>');
            tr.append('<td class="red">' + (d.amount/100).toFixed(2) + '</td>');
            if (d.state == 0) {
                if (d.type == 'deposit') tr.append('<td>充值中</td>');
                else tr.append('<td>等待审核</td>');
            }
            else if (d.state == 1) {
                if (d.type == 'deposit') tr.append('<td>充值完成</td>');
                else tr.append('<td>已打款</td>');
            }
            else {
                tr.append('<td>失败</td>');
            }
            table.append(tr);
        }
        if (list.length == 0) {
            table.append("<tr><td colspan='3'>没有数据</td></tr>");
        }

        // 行点击后显示详情
        $(".log-c table tr").click(function(e) {
            var index = $(e.currentTarget).attr("value");
            if (index == -1) return;
            var data = logList[index];
            if (data)
                showLogDetail(data);
        });

        if (window._mainScroll) _mainScroll.refresh();
    }

    function showLogDetail(data) {
        $("#log_content").css("max-height", ($(document).height() - 60) + "px");
        $("#log").modal({
            width: $(document).width() - 30,
        });

        var c = $("#log .log_content");
        c.empty();
        var t = '<div class="item"><div class="c1">__title__：</div><div class="c2">__v__</div><div class="clear"></div></div>';
        var ff = function(k, v) {
            var line = t.replace(/__title__/, k);
            line = line.replace(/__v__/, v);
            c.append(line);
        }

        ff('交易编号', data.id);
        if (data.type == 'deposit') {
            ff('处理时间', data.end || data.start);
        }
        else {
            ff('发起时间', data.start);
        }
        ff('交易类型', Util.convertLogType(data.type));
        ff('交易金额', (data.amount / 100).toFixed(2));
        if (data.state == 0) {
            if (data.type == 'deposit') ff('交易状态', '充值中');
            else ff('交易状态', '等待审核'); 
        }
        else if (data.state == 1) {
            if (data.type == 'deposit') ff('交易状态', '充值完成'); 
            else ff('交易状态', '已打款');
        }
        else {
            ff('交易状态', '已驳回');
        }

        var memo = {};
        try {
            memo = JSON.parse(data.memo);
        } catch (e) {}
        if (data.type == 'deposit') {
            if (data.channel == 'handOper') {
                // 人工充值
                if (data.channel2 == 'bank') {
                    ff('充值方式', '银行转账');
                    ff('卡号', (memo.account || ''));
					ff('持卡人', (memo.name || ''));
                    ff('备注码', (memo.code || ''));
                    ff('存款时间', (memo.time || ''));
                    ff('账号信息', (memo.requestAccount));
                }
                else if (data.channel2 == 'wechat') {
                    ff('充值方式', '微信转账');
                    ff('微信号', (memo.account || ''));
					ff('昵称', (memo.name || ''));
                    ff('备注码', (memo.code || ''));
                    ff('存款时间', (memo.time || ''));
                    ff('微信号', (memo.requestAccount || ''));
                }
                else if (data.channel2 == 'alipay') {
                    ff('充值方式', '支付宝转账');
                    ff('支付宝账号', (memo.account || ''));
					ff('认证姓名', (memo.name || ''));
                    ff('备注码', (memo.code || ''));
                    ff('存款时间', (memo.time || ''));
                    ff('支付宝账号', (memo.requestAccount || ''));
                    ff('认证姓名', (memo.alipay || ''));
                }
                else if (data.channel2 == 'cft') {
                    ff('充值方式', 'QQ钱包转账');
                    ff('账号', (memo.account || ''));
                    ff('认证姓名', (memo.name || ''));
                    ff('备注码', (memo.code || ''));
                    ff('存款时间', (memo.time || ''));
                    ff('账号信息', (memo.requestAccount || ''));
                }
            }
            else {
                // 在线充值
                ff('充值方式', Util.convertChannel(data.channel2));
            }
        }
        else {
            ff("审核时间", data.end || '');
        }
        if (data.state == 2) {
            if (memo.reason != '') {
                ff('驳回原因', memo.reason);
            }
        }

        if (window._mainScroll) _mainScroll.refresh();
    }

    var _mainScroll;
    $(function() {
        _mainScroll = new IScroll(".scroll-container", {
            scrollX: false,
            scrollY: true,
            click: true,
        })
    });
</script>